<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="../js/angular.min.js"></script>
</head>
<body>
<!--<div ng-app="myApp" ng-controller="customersCtrl">

    <ul>
        <li ng-repeat="x in names">
            {{ x.Name + ', ' + x.Country }}
        </li>
    </ul>

</div>

<script>
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', function($scope, $http) {
        $http.get("records.json")
                .success(function(response) {$scope.names = response.records;});
    });
</script>
<hr>-->
<div ng-app="testApp" ng-controller="testCtrl">
    <ul>
        <li ng-repeat="x in person |orderBy:'city'">
            {{(x.name|uppercase)+"," +x.city}}
        </li>
    </ul>
</div>
<script>
    var app=angular.module("testApp",[]);
    app.controller("testCtrl",function($scope,$http){
        $http.get("person.json").success(function (rep) {
            $scope.person=rep.persons;
        });

    });
</script>

</body>
</html>